<template>
	<view :style="{height:windowHeight+'px'}">
			<uni-nav-bar  :fixed="true" shadow status-bar left-icon="left" right-icon="plusempty" title="巡检计划" @clickLeft="back" @clickRight="add"/>
			<!-- <uni-nav-bar  :fixed="true" shadow  status-bar left-icon="left" left-text="返回" title="巡检计划" @clickLeft="back" /> -->
			<view class="content">
					<uni-card   margin="10px" >
						<view class="flex-b">
							<view class="line20">
								<view><image src="../../static/icon/laicon.png" mode=""></image>   <text class="titleposition">垃圾站</text></view>
								<view><text>发布时间：</text><text>2024-04-01</text></view>
							</view>
							<view class="lineRight">
								<view>江北智慧垃圾站巡检计划</view>
								<view><text class="textBlue">【设备巡查】</text>计划正在进行中</view> 
							</view>
						</view>
						<view class="cardStyle" @click="detail">
							<view class="chakan" ><uni-tag :inverted="true" text="查看详情" type="primary"/></view>
							<view class="jindu"> >  </view>
						</view>
					</uni-card>
					<uni-card  margin="10px">
						<view class="flex-b">
							<view class="line20">
								<view><image src="../../static/icon/laicon.png" mode=""></image>   <text class="titleposition">垃圾站</text></view>
								<view><text>发布时间：</text><text>2024-04-01</text></view>
							</view>
							<view class="lineRight">
								<view>江北智慧垃圾站巡检计划</view>
								<view><text class="textBlue">【设备巡查】</text>计划正在进行中</view> 
							</view>
						</view>
						<view class="cardStyle" @click="detail">
							<view class="chakan"><uni-tag :inverted="true" text="查看详情" type="primary"/></view>
							<view class="jindu"> >  </view>
						</view>
					</uni-card>
					<uni-card  margin="10px">
						<view class="flex-b">
							<view class="line20">
								<view><image src="../../static/icon/laicon.png" mode=""></image>   <text class="titleposition">垃圾站</text></view>
								<view><text>发布时间：</text><text>2024-04-01</text></view>
							</view>
							<view class="lineRight">
								<view>江北智慧垃圾站巡检计划</view>
								<view><text class="textBlue">【设备巡查】</text>计划正在进行中</view> 
							</view>
						</view>
						<view class="cardStyle"  @click="detail">
							<view class="chakan"><uni-tag :inverted="true" text="查看详情" type="primary"/></view>
							<view class="jindu"> >  </view>
						</view>
					</uni-card>
					
				</view>
	</view>
</template>

<script>
	export default {

		data() {
			return {
				windowHeight: 700,
				styleType: 'button'
			}
		},
		onLoad() {
			const sysInfo = uni.getSystemInfoSync();
			this.windowHeight = sysInfo.windowHeight;
			 
		},
		computed: {
			// 使用计算属性将 menuList 数据分割成每个 swiper-item 中的子数组
		
		},
		methods: {
			back() {
				uni.navigateBack({
					delta: 1
				})
			},
			add() {
			
				uni.navigateTo({
					url:'/pages/xunjian/add'
				})
			},
			//选项卡选择
			onClickItem(e) {
				if (this.current !== e.currentIndex) {
					this.current = e.currentIndex
				}
			},
			//查看详情
			detail(e) {
				uni.navigateTo({
					url:'/pages/xunjian/detail'
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.content {
	
		.textBlue{
			color: #0289FF;
		}
		.ml5{
			margin-left: 1rem;
		}
		padding: 20rpx 0;
		.flex-b{
			.line20{
				display: flex;
				    justify-content: space-between;
				    align-items: center;
				view{
					line-height: 1.8rem;
					
				}
				view:nth-of-type(1){
					display: flex;
					align-items: center;
					color: #999999;
				}
				image{
					width: 2rem;
					height: 2rem;
					padding-right: 0.5rem;
				}
			}
			.lineRight{
				display: flex;
				    flex-direction: column;
				    align-items: center;
				    justify-content: center;
					line-height: 2.7rem;
					view:nth-of-type(1){
						font-family: PingFangSC, PingFang SC;
						font-weight: 500;
						font-size: 1.1rem;
						color: #222222;
					}
			}
			
			.titleposition{
				font-size: 1rem;
				font-family: PingFangSC, PingFang SC;
			
			}
		}
		.cardStyle{
			display: flex;
			justify-content: space-between;
			    align-items: center;
			width: 100%;
			height: 2rem;
			padding: 0.2rem;
			.jindu{
			}
			.chakan{
				text-align: center;
			}
		
		}
	}
</style>
